const image = 'https://staticqn.qizuang.com/img/20220429/626b7d823459a-s5.jpg';
const img = 'https://p6.itc.cn/images01/20210610/d0d69113828d48f0890106bd00328478.jpeg'
const items = [{
    label: '日常清洁',
    image: 'https://p4.itc.cn/q_70/images03/20210105/368887382b8e46b283eadc5264f0cf57.jpeg'
  },
  {
    label: '医护上门',
    image: 'https://tse4-mm.cn.bing.net/th/id/OIP-C.GUGcdiX4V0u_wveCQ9ZYGQHaEv?pid=ImgDet&rs=1'
  },
  {
    label: '身体检查',
    image: 'https://ts1.cn.mm.bing.net/th/id/R-C.2c7eace14744de7769133b0a601f08e7?rik=MGeG0JwhwLP%2blQ&riu=http%3a%2f%2fimg95.699pic.com%2fphoto%2f50107%2f2151.jpg_wh860.jpg&ehk=U8DfXETnXoQmmx1iXVPXyl3YfudYi9kEkWvk04YXGh0%3d&risl=&pid=ImgRaw&r=0'
  }
]
const items1 = [{
  label: '空调维修',
  image
}]
Page({
  offsetTopList: [],
  /**
   * 页面的初始数据
   */
  data: {
    sideBarIndex: 1,
    scrollTop: 0,
    categories: [{
        label: '健康',
        title: '健康服务',
        badgeProps: {},
        items,
      },
      {
        label: '家电维修',
        title: '家电维修',
        badgeProps: {},
        items: items1,
      },

    ],
  },
  onSideBarChange(e) {
    console.log(e);
    const {
      value
    } = e.detail;

    this.setData({
      sideBarIndex: value,
      scrollTop: this.offsetTopList[value]
    });
  },
  onClick(e) {
    const {
      label
    } = e.currentTarget.dataset
    if (label == '日常清洁') {
      wx.navigateTo({
        url: '/pageOrder/shopping/servicedetail/servicedetail',
      })
    }
  },
  onScroll(e) {
    const {
      scrollTop
    } = e.detail;
    const threshold = 50; // 下一个标题与顶部的距离

    if (scrollTop < threshold) {
      this.setData({
        sideBarIndex: 0
      });
      return;
    }

    const index = this.offsetTopList.findIndex((top) => top > scrollTop && top - scrollTop <= threshold);

    if (index > -1) {
      this.setData({
        sideBarIndex: index
      });
    }
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    const query = wx.createSelectorQuery().in(this);
    const {
      sideBarIndex
    } = this.data;

    query
      .selectAll('.title')
      .boundingClientRect((rects) => {
        this.offsetTopList = rects.map((item) => item.top);
        this.setData({
          scrollTop: rects[sideBarIndex].top
        });
      })
      .exec();
  },
  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  }
})